<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Plantilla de Bootstrap Gratis</title>

    <!-- Bootstrap Core CSS -->
    <link href="./vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <!-- Custom Fonts -->
    
    <!-- Theme CSS -->
    <link href="css/agency.css" rel="stylesheet"> 
    <script src="./js/jquery-3.3.1.min.js"></script>
    <script src="./js/bootstrap.min.js"></script>

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <script>
    $(document).ready(
        function () { 
            $(".portfolio-caption").css('border-left','1px solid gray')
            $(".portfolio-caption").css('border-right','1px solid gray')
            $(".portfolio-caption").css('border-top','1px solid gray')
            $(".portfolio-caption").css('border-bottom','1px solid gray')
            $(".portfolio-caption").css('border-bottom','1px solid gray')
            $(".portfolio-caption").css('background-color','#996633')
            $(".portfolio-caption").css('padding','0px')
            $(".portfolio-caption").css('color','white')
        }
    )
    
 

   

    </script>
</head>

<body id="page-top" class="index">

    <!-- Navigation -->
    <nav id="mainNav" class="navbar navbar-default navbar-custom navbar-fixed-top">
        <div class="container">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header page-scroll">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                    <span class="sr-only">Toggle navigation</span> Menu <i class="fa fa-bars"></i>
                </button>
                <a class="navbar-brand page-scroll" href="#page-top">全球营养 优中选优</a>
            </div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav navbar-right">
                    <li class="hidden">
                        <a href="#page-top"></a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#portfolio">曼威儿童</a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#portfolio">女士营养</a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#services">男士营养</a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#clients">品牌介绍</a>
                    </li>
                    <li>
                        <a class="page-scroll" href="#contact">联系我们</a>
                    </li>
                </ul>
            </div>
            <!-- /.navbar-collapse -->
        </div>
        <!-- /.container-fluid -->
    </nav>

    <!-- Header -->
    <header>
        <div class="container">
            <div class="intro-text">
                <div class="intro-lead-in">股票代码:300146</div>
                <div class="intro-heading">汤臣倍健 营养 健康</div>
                <a href="#about" class="page-scroll btn btn-xl">马上开始</a>
            </div>
        </div>
    </header>

    <!-- Services Section -->
    <section id="about">
        <div class="container">
            <div class="row">
                <div class="col-md-6">
                        <img src="img/logos/tcbj.jpg" class="img-responsive" alt="">
                </div>
                <div class="col-md-6">       
                        &nbsp;&nbsp;&nbsp;&nbsp;
                         汤臣倍健创立于1995年10月，2002年系统地将膳食补充剂引入中国非直销领域，并迅速成长为中国膳食补充剂领导品牌和标杆企业。
                        2010年8月，国际篮球巨星姚明签约成为汤臣倍健的形象代言人，同年12月15日，汤臣倍健在深圳交易所创业板挂牌上市。
                        十几年来，汤臣倍健坚持执行“三步走”的差异化全球品质战略，从全球原料采购到全球原料专供基地建立，
                        再到全球自有有机农场建立。迄今为止，汤臣倍健原料产地遍及世界各地23个国家和地区，并在巴西、
                        澳大利亚等地建立了五个原料专供基地，自有有机农场也在筹建中。在全球范围内不懈甄选优质原料，
                        汇聚世界各地的营养精粹，构筑起优中选优的营养品联合国。 
                </div>
            </div>
        </div>
    </section>

    <!-- Portfolio Grid Section -->
    <section id="portfolio" class="bg-light-gray">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2 class="section-heading">健壮男人系列</h2>
                    <h3 class="section-subheading text-muted">
                        汤臣倍健一直信奉“诚信比聪明更重要”的理念，汤臣倍健的定位不是为客户，
                        而是为家人和朋友生产全球高品质的营养品。除了高品质的营养品，
                        汤臣倍健更关注解决人们的健康问题和生命质量的提升。

                    </h3>
                </div>
            </div>
            <div class="row">
                <div class="col-md-4 col-sm-6 portfolio-item">
                    <a href="#portfolioModal1" class="portfolio-link" data-toggle="modal">
                        <div class="portfolio-hover">
                            <div class="portfolio-hover-content">
                                <i class="fa fa-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/01.jpg" class="img-responsive" alt="">
                    </a>
                    <div class="portfolio-caption">
                        <div class="good-desc">
                            锌咀嚼片60粒
                            
                        </div>
                        <div class="good-buy">￥99 购买</div>
                            
                    </div>
                </div>
                <div class="col-md-4 col-sm-6 portfolio-item">
                    <a href="#portfolioModal2" class="portfolio-link" data-toggle="modal">
                        <div class="portfolio-hover">
                            <div class="portfolio-hover-content">
                                <i class="fa fa-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/02.jpg" class="img-responsive" alt="">
                    </a>
                    <div class="portfolio-caption" style="border:1px ">                        
                        <h3>锌咀嚼片60粒 <span class="label label-primary">￥99 购买</span></h3>   
                    </div>
                </div>
                <div class="col-md-4 col-sm-6 portfolio-item">
                    <a href="#portfolioModal3" class="portfolio-link" data-toggle="modal">
                        <div class="portfolio-hover">
                            <div class="portfolio-hover-content">
                                <i class="fa fa-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/03.jpg" class="img-responsive" alt="">
                    </a>
                    <div class="portfolio-caption">                        
                        <h3>锌咀嚼片60粒 <span class="label label-primary">￥99 购买</span></h3>   
                    </div>
                </div>
                <div class="col-md-4 col-sm-6 portfolio-item">
                    <a href="#portfolioModal4" class="portfolio-link" data-toggle="modal">
                        <div class="portfolio-hover">
                            <div class="portfolio-hover-content">
                                <i class="fa fa-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/04.jpg" class="img-responsive" alt="">
                    </a>
                    <div class="portfolio-caption">
                        <h4>Corporate A</h4>
                        <p class="text-muted">Brand Indentity</p>
                    </div>
                </div>
                <div class="col-md-4 col-sm-6 portfolio-item">
                    <a href="#portfolioModal5" class="portfolio-link" data-toggle="modal">
                        <div class="portfolio-hover">
                            <div class="portfolio-hover-content">
                                <i class="fa fa-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/05.jpg" class="img-responsive" alt="">
                    </a>
                    <div class="portfolio-caption">
                        <h4>Corporate B</h4>
                        <p class="text-muted">Street Billboard</p>
                    </div>
                </div>
                <div class="col-md-4 col-sm-6 portfolio-item">
                    <a href="#portfolioModal6" class="portfolio-link" data-toggle="modal">
                        <div class="portfolio-hover">
                            <div class="portfolio-hover-content">
                                <i class="fa fa-plus fa-3x"></i>
                            </div>
                        </div>
                        <img src="img/portfolio/06.jpg" class="img-responsive" alt="">
                    </a>
                    <div class="portfolio-caption">
                        <h4>Dreams</h4>
                        <p class="text-muted">Product Identity</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- About Section -->
    <section id="services">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2 class="section-heading">Services</h2>
                    <h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec egestas dignissim ullamcorper.<br>Sed ut orci rutrum, bibendum nisl a, bibendum massa.</h3>
                </div>
            </div>
            <div class="row top-margin-md">
                <div class="col-md-6">
                    <a href="https://dribbble.com/shots/819957-Imac-psd"><img src="img/portfolio/07.png" class="img-responsive" alt=""></a>
                </div>
                <div class="col-md-6">
                    <p class="before-header top-margin-lg">incredible websites</p>
                    <h2 class="section-heading">website development</h2>
                    <h3 class="section-subheading text-muted bottom-margin-sm">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec egestas dignissim ullamcorper. Sed ut orci rutrum, bibendum nisl a, bibendum massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec egestas dignissim ullamcorper. Sed ut orci rutrum, bibendum nisl a, bibendum massa.</h3>
                    <a href="#" class="btn btn-xl">Learn More</a>
                </div>
            </div>

            <div class="row top-margin-lg hidden-sm hidden-xs">
                <div class="col-md-6">
                    <p class="before-header top-margin-lg">incredible websites</p>
                    <h2 class="section-heading">Mobile Design</h2>
                    <h3 class="section-subheading text-muted bottom-margin-sm">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec egestas dignissim ullamcorper. Sed ut orci rutrum, bibendum nisl a, bibendum massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec egestas dignissim ullamcorper. Sed ut orci rutrum, bibendum nisl a, bibendum massa.</h3>
                    <a href="#" class="btn btn-xl">Learn More</a>
                </div>
                <div class="col-md-6">
                    <a href="https://dribbble.com/shots/1317713-iPad-Air-Template"><img src="img/portfolio/08.png" class="img-responsive" alt=""></a>
                </div>
            </div>
        </div>
    </section>

    <!-- Team Section -->
    <section id="clients" class="bg-light-gray">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2 class="section-heading">Our Clients</h2>
                    <h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut eaque, laboriosam veritatis,<br> quos non quis ad perspiciatis, totam corporis ea, alias ut unde.</h3>
                </div>
            </div>

             <div class="row">
                <div class="col-md-3 col-sm-6">
                    <a target="_blank" href="http://cgi.tutsplus.com/">
                        <img src="img/logos/aetuts.jpg" class="img-responsive img-centered" alt="">
                    </a>
                </div>
                <div class="col-md-3 col-sm-6">
                    <a target="_blank" href="http://designmodo.com/">
                        <img src="img/logos/designmodo.jpg" class="img-responsive img-centered" alt="">
                    </a>
                </div>
                <div class="col-md-3 col-sm-6">
                    <a target="_blank" href="https://wordpress.org/">
                        <img src="img/logos/wordpress.jpg" class="img-responsive img-centered" alt="">
                    </a>
                </div>
                <div class="col-md-3 col-sm-6">
                    <a target="_blank" href="https://creativemarket.com">
                        <img src="img/logos/creative-market.jpg" class="img-responsive img-centered" alt="">
                    </a>
                </div>
            </div>
        </div>
    </section>

    <!-- Contact Section -->
    <section id="contact">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2 class="section-heading">Contact Us</h2>
                    <h3 class="section-subheading text-muted bottom-margin-sm">Lorem ipsum dolor sit amet consectetur.</h3>
                    <a target="_blank" href="mailto:contact@creative.com" class="btn btn-xl">contact@creative.com</a>
                </div>
            </div>
           
        
        </div>
    </section>

    <footer>
        <div class="container">
            <div class="row">
                <div class="col-md-4">
                    <span class="copyright">More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></span>
                </div>
                <div class="col-md-4">
                </div>
                <div class="col-md-4">
                    <ul class="list-inline quicklinks">
                        <li><a href="#plantilla-de-bootstrap-gratis.html">Credits and Resources</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </footer>

    <!-- Portfolio Modals -->
    <!-- Use the modals below to showcase details about your portfolio projects! -->

    <!-- Portfolio Modal 1 -->
    <div class="portfolio-modal modal fade" id="portfolioModal1" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="close-modal" data-dismiss="modal">
                    <div class="lr">
                        <div class="rl">
                        </div>
                    </div>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-8 col-lg-offset-2">
                            <div class="modal-body">
                                <!-- Project Details Go Here -->
                                <h2>Project Name</h2>
                                <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
                                <img class="img-responsive img-centered" src="img/portfolio/01x.jpg" alt="">
                                <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
                                <p><strong>You can download this PSD Mockup template in this portfolio sample item at</strong> <a target="_blank" href="https://www.behance.net/gallery/37627001/iPhone-6s-Space-Gray-mockups-FREEBIE">Mockup</a></p>
                                <ul class="list-inline">
                                    <li>Date: July 2016</li>
                                    <li><b>Author:</b> <a target="_blank" href="http://360mockups.com/">360 Mockups</a></li>
                                    <li>Category: Graphic Design</li>
                                </ul>
                                <button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-times"></i> Close Project</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Portfolio Modal 2 -->
    <div class="portfolio-modal modal fade" id="portfolioModal2" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="close-modal" data-dismiss="modal">
                    <div class="lr">
                        <div class="rl">
                        </div>
                    </div>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-8 col-lg-offset-2">
                            <div class="modal-body">
                                <h2>Project Heading</h2>
                                <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
                                <img class="img-responsive img-centered" src="img/portfolio/02x.jpg" alt="">
                                <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
                               <p><strong>You can download this PSD Mockup template in this portfolio sample item at</strong> <a target="_blank" href="http://freebiesbug.com/psd-freebies/app-showcase-mockup-psd/">Mockup</a></p>
                               <ul class="list-inline">
                                    <li>Date: July 2016</li>
                                    <li><b>Author:</b> <a target="_blank" href="https://dribbble.com/ikima">Vitaly</a></li>
                                    <li>Category: Graphic Design</li>
                                </ul>
                                <button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-times"></i> Close Project</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Portfolio Modal 3 -->
    <div class="portfolio-modal modal fade" id="portfolioModal3" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="close-modal" data-dismiss="modal">
                    <div class="lr">
                        <div class="rl">
                        </div>
                    </div>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-8 col-lg-offset-2">
                            <div class="modal-body">
                                <!-- Project Details Go Here -->
                                <h2>Project Name</h2>
                                <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
                                <img class="img-responsive img-centered" src="img/portfolio/03x.jpg" alt="">
                                <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
                                <p><strong>You can download this PSD Mockup template in this portfolio sample item at</strong> <a target="_blank" href="https://creativemarket.com/muwa_one/707383-Workspace-Mockup-Set-5">Mockup</a></p>
                                 <ul class="list-inline">
                                    <li>Date: July 2016</li>
                                    <li><b>Author:</b> <a target="_blank" href="https://creativemarket.com/muwa_one">Best Pixels</a></li>
                                    <li>Category: Graphic Design</li>
                                </ul>
                                <button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-times"></i> Close Project</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Portfolio Modal 4 -->
    <div class="portfolio-modal modal fade" id="portfolioModal4" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="close-modal" data-dismiss="modal">
                    <div class="lr">
                        <div class="rl">
                        </div>
                    </div>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-8 col-lg-offset-2">
                            <div class="modal-body">
                                <!-- Project Details Go Here -->
                                <h2>Project Name</h2>
                                <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
                                <img class="img-responsive img-centered" src="img/portfolio/04x.jpg" alt="">
                                <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
                                <p><strong>You can download this PSD Mockup template in this portfolio sample item at</strong> <a target="_blank" href="https://dribbble.com/shots/1998349-Ceramic-Bottle-Mockup-Free-PSD">Mockup</a></p>
                                 <ul class="list-inline">
                                    <li>Date: July 2016</li>
                                    <li><b>Author:</b> <a target="_blank" href="#">Raul Taciu</a></li>
                                    <li>Category: Graphic Design</li>
                                </ul>
                                <button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-times"></i> Close Project</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Portfolio Modal 5 -->
    <div class="portfolio-modal modal fade" id="portfolioModal5" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="close-modal" data-dismiss="modal">
                    <div class="lr">
                        <div class="rl">
                        </div>
                    </div>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-8 col-lg-offset-2">
                            <div class="modal-body">
                                <!-- Project Details Go Here -->
                                <h2>Project Name</h2>
                                <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
                                <img class="img-responsive img-centered" src="img/portfolio/05x.jpg" alt="">
                                <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
                                <p><strong>You can download this PSD Mockup template in this portfolio sample item at</strong> <a target="_blank" href="#street-billboard-psd-mockup-2/">Mockup</a></p>
                                 <ul class="list-inline">
                                    <li>Date: July 2016</li>
                                    <li><b>Author:</b> <a target="_blank" href="#">Graphic Burger</a></li>
                                    <li>Category: Graphic Design</li>
                                </ul>
                                <button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-times"></i> Close Project</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Portfolio Modal 6 -->
    <div class="portfolio-modal modal fade" id="portfolioModal6" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="close-modal" data-dismiss="modal">
                    <div class="lr">
                        <div class="rl">
                        </div>
                    </div>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-8 col-lg-offset-2">
                            <div class="modal-body">
                                <!-- Project Details Go Here -->
                                <h2>Project Name</h2>
                                <p class="item-intro text-muted">Lorem ipsum dolor sit amet consectetur.</p>
                                <img class="img-responsive img-centered" src="img/portfolio/06x.jpg" alt="">
                               <p>Use this area to describe your project. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est blanditiis dolorem culpa incidunt minus dignissimos deserunt repellat aperiam quasi sunt officia expedita beatae cupiditate, maiores repudiandae, nostrum, reiciendis facere nemo!</p>
                                <p><strong>You can download this PSD Mockup template in this portfolio sample item at</strong> <a target="_blank" href="#paper-pouch-packaging-mockup/">Mockup</a></p>
                                 <ul class="list-inline">
                                    <li>Date: July 2016</li>
                                    <li>More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></li>
                                    <li>Category: Graphic Design</li>
                                </ul>
                                <button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-times"></i> Close Project</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- jQuery -->
    <script src="vendor/jquery/jquery.min.js"></script>

    <!-- Bootstrap Core JavaScript -->
    <script src="vendor/bootstrap/js/bootstrap.min.js"></script>

    <!-- Plugin JavaScript -->
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>

    <!-- Contact Form JavaScript -->
    <script src="js/jqBootstrapValidation.js"></script>
    <script src="js/contact_me.js"></script>

    <!-- Theme JavaScript -->
    <script src="js/agency.min.js"></script>

</body>

</html>
